<h4><%= header %></h4>
<form id="EditView" name="EditView" method="POST" onsubmit="return false;">
<input type="submit" style="display: none;" data-role="none">
<ul data-role="listview" data-theme="a">
<li data-role="list-divider"><%= helper.translate('LBL_TASK_INFORMATION', 'Tasks') %></li>
<li>
<label for="name"><%= helper.translate('LBL_SUBJECT', 'Tasks') %></label>
<input type='text' name='name' 
id='name'
maxlength='50' 
value="<%= model.get('name') %>"      required      >
</li>
<li>
<label for="status"><%= helper.translate('LBL_STATUS', 'Tasks') %></label>
<select 
name="status" 
id="status" 
required 	    
>
<%= helper.getHtmlOptions(model.get('status'), 'task_status_dom' ) %>
</select>
</li>
<li>
<label for="priority"><%= helper.translate('LBL_PRIORITY', 'Tasks') %></label>
<select 
name="priority" 
id="priority" 
required 	    
>
<%= helper.getHtmlOptions(model.get('priority'), 'task_priority_dom' ) %>
</select>
</li>
<li>
<label for="date_start"><%= helper.translate('LBL_START_DATE', 'Tasks') %></label>
<div class="ui-grid-a">
<div class="ui-block-a">
<input 
onclick="$(this).scroller('show')"
value="<%= helper.getDateTime().convertToDisplayDate(model.get('date_start')) %>" name="date_start_date" id="date_start_date">
</div>
<div class="ui-block-b">		
<input value="<%= helper.getDateTime().convertToDisplayTime(model.get('date_start')) %>" name="date_start_time" id="date_start_time">
</div>
</div>
<button type="button" id="date_start_clear" 
onclick="$('#date_start').val(''); $('#date_start_date').val(''); $('#date_start_time').val('');"
><%= helper.string('Clear') %></button>
<input type="hidden" value="<%= model.get('date_start') %>" name="date_start" id="date_start">
<%
$(window).bind('create', function() {
var selectHandler = function (e) {
var datePart = $("#date_start_date").val();
var timePart = $("#date_start_time").val();
var dateString =  datePart + ' ' + timePart;		
if (datePart == '' || timePart == '') {
dateString = '';
}					
$("#date_start").val(helper.getDateTime().convertToBase(dateString));		
}
$("#date_start_date").scroller({
preset: 'date',
theme: 'default',
display: 'modal',
mode: 'clickpick',
startYear: 2000,
endYear: 2020,
delay: 1000,
dateFormat: '<%= helper.getDateTime().dateFormat2 %>',
dateOrder: '<%= helper.getDateTime().dateFormat2 %>',
onSelect: selectHandler
});
$("#date_start_time").scroller({
preset: 'time',
theme: 'default',
display: 'modal',
delay: 1000,
mode: 'clickpick',
timeFormat: '<%= helper.getDateTime().timeFormat2 %>',
timeWheels: '<%= helper.getDateTime().timeFormat2 %>',
stepMinute: 15,
onSelect: selectHandler
});
});
%>
</li>
<li>
<label for="date_due"><%= helper.translate('LBL_DUE_DATE', 'Tasks') %></label>
<div class="ui-grid-a">
<div class="ui-block-a">
<input 
onclick="$(this).scroller('show')"
value="<%= helper.getDateTime().convertToDisplayDate(model.get('date_due')) %>" name="date_due_date" id="date_due_date">
</div>
<div class="ui-block-b">		
<input value="<%= helper.getDateTime().convertToDisplayTime(model.get('date_due')) %>" name="date_due_time" id="date_due_time">
</div>
</div>
<button type="button" id="date_due_clear" 
onclick="$('#date_due').val(''); $('#date_due_date').val(''); $('#date_due_time').val('');"
><%= helper.string('Clear') %></button>
<input type="hidden" value="<%= model.get('date_due') %>" name="date_due" id="date_due">
<%
$(window).bind('create', function() {
var selectHandler = function (e) {
var datePart = $("#date_due_date").val();
var timePart = $("#date_due_time").val();
var dateString =  datePart + ' ' + timePart;		
if (datePart == '' || timePart == '') {
dateString = '';
}					
$("#date_due").val(helper.getDateTime().convertToBase(dateString));		
}
$("#date_due_date").scroller({
preset: 'date',
theme: 'default',
display: 'modal',
mode: 'clickpick',
startYear: 2000,
endYear: 2020,
delay: 1000,
dateFormat: '<%= helper.getDateTime().dateFormat2 %>',
dateOrder: '<%= helper.getDateTime().dateFormat2 %>',
onSelect: selectHandler
});
$("#date_due_time").scroller({
preset: 'time',
theme: 'default',
display: 'modal',
delay: 1000,
mode: 'clickpick',
timeFormat: '<%= helper.getDateTime().timeFormat2 %>',
timeWheels: '<%= helper.getDateTime().timeFormat2 %>',
stepMinute: 15,
onSelect: selectHandler
});
});
%>
</li>
<li>
<label for="parent_name"><%= helper.translate('LBL_LIST_RELATED_TO', 'Tasks') %></label>
<div class="ui-grid-a">
<div class="ui-block-a">
<select 
name="parent_type" 
onchange="changeparent_type(); clearparent_type();"
id="parent_type">
<%= helper.getHtmlOptions(model.get('parent_type'), 'parent_type_display' ) %>
</select>
</div>
<div class="ui-block-b">
<input type="text" value="<%= model.get('parent_name') %>" name="parent_name" id="parent_name" autocomplete="off">
<div>
<ul id="parent_name-suggestions" data-role="listview" data-inset="true"></ul>
</div>
</div>
</div>
<input type="hidden" value="<%= model.get('parent_id') %>" name="parent_id" id="parent_id">
<script type="text/javascript">
	function clearparent_type(){
		$("#parent_id").val('');
		$("#parent_name").val('');
	}
	function changeparent_type() {
		$("#parent_name").autocomplete('parent_id', $("#parent_type").val());
	}
	changeparent_type();	
</script>
</li>
<li>
<label for="description"><%= helper.translate('LBL_DESCRIPTION', 'Tasks') %></label>
<textarea name='description'  tabindex="" ><%= model.get('description') %></textarea>
</li>
<li data-role="list-divider"><%= helper.translate('LBL_PANEL_ADVANCED', 'Tasks') %></li>
<li>
<label for="assigned_user_name"><%= helper.translate('LBL_ASSIGNED_TO_NAME', 'Tasks') %></label>
<input  type="text" value="<%= model.get('assigned_user_name') %>" name="assigned_user_name" id="assigned_user_name" autocomplete="off">
<input type="hidden" value="<%= model.get('assigned_user_id') %>" name="assigned_user_id" id="assigned_user_id">
<div>
<ul id="assigned_user_name-suggestions" data-role="listview" data-inset="true"></ul>
</div>
<script type="text/javascript">
	$("#assigned_user_name").autocomplete('assigned_user_id', 'Users');
</script>
</li>
</ul>
</form>
